Description

Adds an as: option to RubyUI::TabsTrigger (default :button) so a trigger can render as an <a href> instead of a <button>.

This is useful when tabs are actually navigation links — e.g. server-rendered tabs driven by a query param (?tab=...). The common workaround is to wrap a TabsTrigger (<button>) inside a Link (<a>), which produces a <button> nested inside an <a>. That is invalid HTML and a keyboard/accessibility problem (nested interactive elements). With as: :a, each navigable tab collapses to a single <a> while keeping the trigger's styling and data-* attributes.

Behavior

• Default is unchanged: TabsTrigger still renders <button type="button">, so existing client-side tabs are unaffected (fully backward compatible).
• TabsTrigger(value: ..., as: :a, href: ...) renders <a href> with the same classes and data-* (data-ruby-ui--tabs-target="trigger", the click->ruby-ui--tabs#show action, and data-value).
• type="button" is only emitted for the :button variant (it's invalid on an anchor).

The ruby-ui--tabs#show Stimulus controller does not call preventDefault, so the anchor navigates normally while the active state stays driven by the data-* attributes.

Usage

Tabs(default_value: "account", class: "w-96") do
  TabsList do
    TabsTrigger(value: "account", as: :a, href: "?tab=account") { "Account" }
    TabsTrigger(value: "password", as: :a, href: "?tab=password") { "Password" }
  end
end

Changes

• gem/lib/ruby_ui/tabs/tabs_trigger.rb — add as: option and conditional element/type rendering.
• gem/test/ruby_ui/tabs_trigger_test.rb — new tests: renders as <button> by default, renders as <a href> with as: :a, and preserves trigger data-* on the anchor.
• docs/app/views/docs/tabs.rb — add an "As navigation links" example.

How to test

cd gem
bundle exec rake test TEST=test/ruby_ui/tabs_trigger_test.rb
bundle exec rake   # full suite + standardrb

🤖 Generated with Claude Code

Summary by cubic

Add as: to RubyUI::TabsTrigger to render triggers as <a href> for navigation tabs; anchors keep trigger classes and data-* and navigate normally. Default remains <button type="button">, and we now always emit type="button" for any non-anchor trigger to prevent accidental form submissions (e.g., when as: is mistyped).

^{Written for commit f753dd8. Summary will update on new commits.}